<template>
    <view class="container">
        <header-bar :config="config"></header-bar>
        <tab-bar v-if="false" :tabs="tabs" @clickTab="clickTab" :tabIndex="tabIndex"></tab-bar>
        <view class="main">
            <swiper
                class="swiper"
                v-if="loadOk"
                :style="{ height: listHeight }"
                :current="tabIndex"
                @change="swiperChange">
                <!-- <swiper-item>
					<select-staff-list :height="listHeight" @selectFn="selectFn"></select-staff-list>
				</swiper-item> -->
                <swiper-item>
                    <select-customer-list :height="listHeight" @selectFn="selectFn"></select-customer-list>
                </swiper-item>
            </swiper>
        </view>
    </view>
</template>

<script>
import { getElementHeight } from "@/uni-sub-base/utils/elementUtil.js"
import tabBar from "@/components/common/tab-bar.vue"
import selectStaffList from "@/components/select/select-staff-list.vue"
import selectCustomerList from "@/components/select/select-customer-list.vue"
export default {
    components: {
        tabBar,
        selectStaffList,
        selectCustomerList,
    },
    data() {
        return {
            config: {
                title: "推荐人",
                centerSlot: true,
            },
            datas: [],
            tabs: [
                // {id:1,title:'员工'},
                { id: 2, title: "客户" },
            ],
            tabIndex: 0,
            loadOk: false,
            listHeight: "",
        }
    },
    mounted() {
        this.getListHeight()
    },
    onShow() {},
    methods: {
        selectFn(data, type) {
            const eventChannel = this.getOpenerEventChannel()
            eventChannel.emit("getSelectData", {
                ...data,
                type: type,
            })
            console.log(123)
            this.easyGoBack()
        },
        swiperChange(e) {
            let tabIndex = e.detail.current
            this.clickTab(tabIndex)
        },
        //tab切换
        clickTab(index) {
            if (this.tabIndex != index) {
                clearTimeout(this.timer)
                this.timer = setTimeout((time) => {
                    this.tabIndex = index
                }, 20)
            }
        },
        getListHeight() {
            //获取商品高度
            getElementHeight(this, ".main", (e) => {
                this.listHeight = e + "px"
                this.loadOk = true
            })
        },
    },
}
</script>

<style lang="scss">
.select-level-item {
    padding: $app-page-padding;
    background: $color-white;
    border-bottom: solid 1rpx $border;
    display: flex;
    flex-direction: row;
    align-items: center;
    .select-level-item-name {
        flex: 1;
    }
}
</style>
